feat: Documentation URL in GithubDetails #1606

Volv-G · 2026-01-08T20:25:38Z

Description

Added support for displaying documentation links in the component details panel. This enhancement allows users to access component documentation directly from the UI when the component's metadata includes a documentation_path annotation.

The changes refactor the URL reconstruction logic in the TaskDetails component to handle both component YAML paths and documentation paths. When a component includes the necessary Git metadata annotations and a documentation path, a new "Documentation" section appears in the details panel with links to view the documentation and its directory on GitHub.

See example:

Based on the component with the following definition:

name: Scrape V2
description: Runs a query set against Shop Server (V2 - streamlined inputs)
inputs:
- name: env
  type: String
- name: query_set_name
  type: String
  optional: true
- name: access_route
  type: String
  optional: true
- name: template_params
  type: String
  optional: true
- name: execution_config
  type: String
  optional: true
- name: feature_flags
  type: String
  optional: true
- name: description
  type: String
  optional: true
- name: custom_run_id_prefix
  type: String
  optional: true
- name: external_query
  type: String
  optional: true
- name: parameter_overrides
  type: String
  optional: true
- name: flatten_products
  type: Boolean
  optional: true
- name: query_limit
  type: Integer
  optional: true
- name: export_to_parquet
  type: Boolean
  optional: true
  default: 'False'
- name: min_success_rate
  type: Float
  optional: true
- name: allow_partial_results
  type: Boolean
  optional: true
  default: 'False'
- name: output_raw_data
  type: Boolean
  optional: true
  default: 'False'
- name: env_vars
  type: String
  optional: true
- name: cache_bust_key
  type: String
  optional: true
outputs:
- name: run_id
  type: String
- name: run_results
  type: Parquet
- name: bsl_script
  type: String
- name: stats
  type: String
- name: raw_data
  type: Parquet
- name: evaluation_tool_link
  type: String
- name: scrape_date
  type: String
- name: timings
  type: String
implementation:
  container:
    image: us-docker.pkg.dev/shopify-docker-images/containers/apps/production/cloud-run-eval-slim-update:b580741f41463291a6197424f292ea87b6ad26b9
    command:
    - query-eval
    - query-v2
    - --env
    - inputValue: env
    - --run-id-path
    - outputPath: run_id
    - --results-path
    - outputPath: run_results
    - --bsl-script-path
    - outputPath: bsl_script
    - --stats-path
    - outputPath: stats
    - --raw-data-path
    - outputPath: raw_data
    - --evaluation-tool-link-path
    - outputPath: evaluation_tool_link
    - --scrape-date-path
    - outputPath: scrape_date
    - --timings-path
    - outputPath: timings
    - if:
        cond:
          isPresent: query_set_name
        then:
        - --query-set-name
        - inputValue: query_set_name
    - if:
        cond:
          isPresent: access_route
        then:
        - --access-route
        - inputValue: access_route
    - if:
        cond:
          isPresent: template_params
        then:
        - --template-params
        - inputValue: template_params
    - if:
        cond:
          isPresent: execution_config
        then:
        - --execution-config
        - inputValue: execution_config
    - if:
        cond:
          isPresent: feature_flags
        then:
        - --feature-flags
        - inputValue: feature_flags
    - if:
        cond:
          isPresent: description
        then:
        - --description
        - inputValue: description
    - if:
        cond:
          isPresent: custom_run_id_prefix
        then:
        - --custom-run-id-prefix
        - inputValue: custom_run_id_prefix
    - if:
        cond:
          isPresent: external_query
        then:
        - --external-query
        - inputValue: external_query
    - if:
        cond:
          isPresent: parameter_overrides
        then:
        - --parameter-overrides
        - inputValue: parameter_overrides
    - if:
        cond:
          isPresent: flatten_products
        then:
        - if:
            cond:
              inputValue: flatten_products
            then:
            - --flatten-products
    - if:
        cond:
          isPresent: query_limit
        then:
        - --query-limit
        - inputValue: query_limit
    - if:
        cond:
          isPresent: export_to_parquet
        then:
        - if:
            cond:
              inputValue: export_to_parquet
            then:
            - --export-to-parquet
    - if:
        cond:
          isPresent: min_success_rate
        then:
        - --min-success-rate
        - inputValue: min_success_rate
    - if:
        cond:
          isPresent: allow_partial_results
        then:
        - if:
            cond:
              inputValue: allow_partial_results
            then:
            - --allow-partial-results
    - if:
        cond:
          isPresent: output_raw_data
        then:
        - if:
            cond:
              inputValue: output_raw_data
            then:
            - --output-raw-data
    - if:
        cond:
          isPresent: env_vars
        then:
        - --env-vars
        - inputValue: env_vars
    - if:
        cond:
          isPresent: cache_bust_key
        then:
        - --cache-bust-key
        - inputValue: cache_bust_key
metadata:
  annotations:
    version: '1.27'
    updated_at: '2026-01-08T19:12:57Z'
    component_yaml_path: oasis/components/scrape-v2.yaml
    documentation_path: oasis/components/docs/scrape-v2.md
    git_remote_url: https://github.com/Shopify/discovery.git
    git_relative_dir: relevance-tools/src/relevance_tools
    published_at: '2026-01-08T19:44:55.266948+00:00'
    git_remote_sha: b580741f41463291a6197424f292ea87b6ad26b9
    git_remote_branch: volv/scrape-readme

Type of Change

Checklist

I have tested this does not break current pipelines / runs functionality
I have tested the changes on staging

Volv-G · 2026-01-08T20:25:54Z

feat: Documentation URL in GithubDetails #1606 👈 (View in Graphite)
master

This stack of pull requests is managed by Graphite. Learn more about stacking.

morgan-wowk

Awesome

src/components/shared/TaskDetails/Details.tsx

src/components/shared/TaskDetails/GithubDetails.tsx

camielvs

Looks good. A minor change to convert string -> boolean in the render check. And some suggestions for the Layout to add a little bit of space between the URL and Documentation sections

Volv-G · 2026-01-13T16:38:31Z

Merge activity

Jan 13, 4:38 PM UTC: A user started a stack merge that includes this pull request via Graphite.
Jan 13, 4:38 PM UTC: @Volv-G merged this pull request with Graphite.

Volv-G marked this pull request as ready for review January 8, 2026 20:28

Volv-G requested a review from a team as a code owner January 8, 2026 20:28

Volv-G marked this pull request as draft January 8, 2026 20:29

Volv-G force-pushed the volv/add_documentation_url_to_githubdetails branch from 7092d59 to cb2f3ca Compare January 9, 2026 00:40

Volv-G changed the title ~~Add documentation URL to GithubDetails~~ feat: Documentation URL in GithubDetails Jan 9, 2026

Volv-G marked this pull request as ready for review January 9, 2026 00:49

morgan-wowk approved these changes Jan 9, 2026

View reviewed changes

maxy-shpfy reviewed Jan 9, 2026

View reviewed changes

src/components/shared/TaskDetails/Details.tsx Outdated Show resolved Hide resolved

Volv-G force-pushed the volv/add_documentation_url_to_githubdetails branch 2 times, most recently from 3f16ca3 to c11d35e Compare January 10, 2026 00:16

Volv-G added the #gsd:46847 label Jan 10, 2026 — with Graphite App

Volv-G requested review from maxy-shpfy and morgan-wowk January 12, 2026 20:04